<template>
  <div>
    <head-container></head-container>
    <section class="bbs_cont" style="padding-top:116px;">
      <div class="head_tip">当前位置：
        <router-link to="/" tag="span">首页</router-link>>
        <span>睿那论坛</span>
      </div>
      <p class="want_post"><span @click="wantPost">我要发帖</span></p>
      <bbs-section 
        v-for="item in plate"
        :key="item.id"
        :category='{title:item.title,id:item.id,tag:0}'></bbs-section>
    </section>
    <foot-cotainer></foot-cotainer>
  </div>
</template>

<script>
import headContainer from '@/components/headContainer'
import bbsSection from '@/components/bbsSection'
import footCotainer from "@/components/footContainer";
import { VueEditor } from 'vue2-editor'
export default {
  name: 'Home',
  data () {
    return {
      plate:[],
      isShow:true,//发帖区域隐藏
    }
  },
  components:{
    headContainer,
    bbsSection,
    footCotainer
  },
  methods:{
    wantPost(){
      this.$router.push('/cont')
    }
  },
  mounted(){
    //获取首页板块数据
    this.GLOBAL.request({
      baseURL:this.GLOBAL.API_RNTY_URL,
      url:'ftcates/top_4',
    }).then(({data:data})=>{
      this.plate = data;
    })
  },
}
</script>
<style scoped>
.head{
  height:40px;
  background-color: #f2f2f2;
}
.head_tip{
  margin-bottom:50px;
}
.head_tip span{
  cursor: pointer;
}
.bbs_cont{
  width:1200px;
  min-height:800px;
  margin: 0 auto;
  overflow: hidden;
}
.want_post{
  padding-right:20px;
  text-align: right;
}
.want_post span{
  cursor: pointer;
  color:#3c99d5;
  position: relative;
}
.want_post span::after{
  content: url('../assets/images/sendpost.png');
  position: absolute;
  left:-20px;
  top: 3px;
}
</style>

